// pages/navigation/navigation.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 地图中心点的位置经纬度
    latitude: 30.674084, // 标注点的纬度
    longitude: 111.184761, // 标注点的经度
    active_id: '',
    active_info: {},
    from_latitude: 30.69322,
    from_longitude: 111.26824,
    to_latitude: 30.674084,
    to_longitude: 111.184761,
    // 标注点数据
    markers: [{
      id: 0, // 标注点的唯一标识
      latitude: 30.674084, // 标注点的纬度
      longitude: 111.184761, // 标注点的经度
      iconPath: "/images/icons/start.png", // 标注点的图标路径
      width: 30, // 图标的宽度
      height: 30, // 图标的高度
      callout: { // 标注点的气泡提示
        content: "起点",
        color: "#000",
        fontSize: 14,
        bgColor: "#fff",
        padding: 5,
        borderRadius: 5,
        display: "ALWAYS" //'BYCLICK':点击显示; 'ALWAYS':常显
      }
    }, {
      id: 1, // 标注点的唯一标识
      latitude: 30.674084, // 标注点的纬度
      longitude: 111.184761, // 标注点的经度
      iconPath: "/images/icons/end.png", // 标注点的图标路径
      width: 30, // 图标的宽度
      height: 30, // 图标的高度
      callout: { // 标注点的气泡提示
        content: "创业讲座",
        color: "#000",
        fontSize: 14,
        bgColor: "#fff",
        padding: 5,
        borderRadius: 5,
        display: "ALWAYS" //'BYCLICK':点击显示; 'ALWAYS':常显
      }
    }],
    polyline: [{
      points: [],
      color: "#FF0000",
      width: 6
    }],
    travel_type: [{
        id: 0,
        name: 'walking',
        name_c: '步行'
      },
      {
        id: 1,
        name: 'bicycling',
        name_c: '骑行'
      },
      {
        id: 2,
        name: 'driving',
        name_c: '驾车'
      }
    ],
    selectedIndex: 0,
    selected_type: 'walking',
    selected_name: '步行',
    steps_show: [],
    duration: '', // 时间
    distance: '', // 距离
    showScrollTip: false,
  },
  // 通过活动的id从而获取此活动的详细信息
  active_info() {
    wx.cloud.database().collection('actives').doc(this.data.active_id)
      .get({
        success: (res) => {
          console.log("数据请求成功", res)
          const active_info = res.data
          // 终点标记点更改
          const new_markers = this.data.markers
          new_markers[1].latitude = res.data.latitude
          new_markers[1].longitude = res.data.longitude
          new_markers[1].callout.content = res.data.name
          const to_latitude = res.data.latitude
          const to_longitude = res.data.longitude
          this.setData({
            active_info,
            markers: new_markers,
            latitude: res.data.latitude,
            longitude: res.data.longitude,
            to_latitude,
            to_longitude
          })
          // 设置导航栏标题
          wx.setNavigationBarTitle({
            title: res.data.name,
          })
          // 获取用户当前位置后调用路线规划
          this.getUserLocation();
        },
        fail(err) {
          console.log("数据请求失败", err)
        }
      })
  },
  // 获取用户当前位置
  getUserLocation() {
    wx.getLocation({
      type: 'wgs84',
      success: (res) => {
        console.log('用户的位置', res);
        const from_latitude = res.latitude
        const from_longitude = res.longitude
        const marker_start = this.data.markers
        marker_start[0].latitude = res.latitude
        marker_start[0].longitude = res.longitude
        this.setData({
          from_latitude,
          markers: marker_start,
          from_longitude,
          longitude: res.longitude,
          latitude: res.latitude,
        });
        console.log("用户位置：", res.longitude, res.latitude)
        // 当获取到用户位置信息之后：
        // 调用路线规划
        this.line_plan();
      },
      fail: (err) => {
        console.error('获取位置失败', err);
        if (err.errMsg === 'getLocation:fail auth deny') {
          wx.showModal({
            title: '提示',
            content: '需要授权位置权限才能使用地图功能',
            showCancel: false,
            success: () => {
              wx.openSetting({
                success(settingdata) {
                  if (settingdata.authSetting['scope.userLocation']) {
                    // 用户重新授权后，重新获取位置
                    wx.getLocation({
                      type: 'wgs84',
                      success: (res) => {
                        console.log("获取位置成功")
                        const from_latitude = res.latitude
                        const from_longitude = res.longitude
                        this.setData({
                          from_latitude,
                          from_longitude,
                          longitude: res.longitude,
                          latitude: res.latitude,
                        });
                        // 调用路线规划
                        this.line_plan();
                      }
                    });
                  }
                }
              });
            }
          });
        }
      }
    });
  },
  // 路线API
  line_plan() {
    console.log("起点坐标：", this.data.from_latitude, this.data.from_longitude);
    console.log("终点坐标：", this.data.to_latitude, this.data.to_longitude);
    wx.request({
      url: `https://apis.map.qq.com/ws/direction/v1/${this.data.selected_type}/`,
      data: {
        from: `${this.data.from_latitude},${this.data.from_longitude}`,
        to: `${this.data.to_latitude},${this.data.to_longitude}`,
        key: 'GDOBZ-2LLCW-Z26RL-3PJU4-MRYCK-N4BOP' // 替换为你的腾讯地图Key
      },
      success: (res) => {
        console.log('路线规划结果：', res.data);
        if (res.data.status === 0) {
          const polyline = this.decodePolyline(res.data.result.routes[0].polyline);
          console.log('解码后的路线坐标：', polyline);
          // 花费的时间
          const duration = res.data.result.routes[0].duration
          // 方案的距离
          const distance = res.data.result.routes[0].distance
          // 指导怎么走
          const steps_show = res.data.result.routes[0].steps
          this.setData({
            polyline: [{
              points: polyline,
              color: '#FF0000',
              width: 6,
              borderDashed: [10, 10]
            }],
            steps_show,
            duration,
            distance
          });
          console.log("data中的路线规划：", this.data.steps_show)
        } else {
          console.error('路线规划失败：', res.data.message);
          wx.showToast({
            title: '路线规划失败：' + res.data.message,
            icon: 'none',
            duration: 2000
          });
        }
      },
      fail: (error) => {
        console.error('请求失败：', error);
        wx.showToast({
          title: '请求失败，请重试',
          icon: 'none',
          duration: 2000
        });
      }
    });
  },
  // 路线解码操作
  decodePolyline(encoded) {
    const coors = encoded
    let points = []
    for (let i = 2; i < coors.length; i++) {
      coors[i] = Number(coors[i - 2] + coors[i] / 1000000)
    }
    for (let i = 0; i < coors.length; i += 2) {
      if (i + 1 < coors.length) {
        points.push({
          latitude: coors[i],
          longitude: coors[i + 1]
        });
      }
    }
    console.log("得到了适合map组件中polyline属性，points格式的数组", points)
    return points;
  },
  // 点击选择出行方式
  selectItem(e) {
    const index = e.currentTarget.dataset.index;
    console.log(e)
    const selected_type = e.currentTarget.dataset.item.name
    const selected_name = e.currentTarget.dataset.item.name_c
    this.setData({
      selectedIndex: index, // 更新选中索引
      selected_type,
      selected_name
    });
    console.log(this.data.selectedIndex, this.data.selected_type)
    console.log(this.data.selected_type)
    // 获取活动信息
    this.active_info();
  },
  // 触底回调
  onReachBottom() {
    // 触发短震动（需要真机体验）
    wx.vibrateShort();
    // 显示滚动到底部提示
    this.setData({
      showScrollTip: true
    });
    // 2秒后自动隐藏提示
    setTimeout(() => this.setData({
      showScrollTip: false
    }), 2000);
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    // 进入页面时显示加载提示
    wx.showLoading({
      title: '加载中...',
      mask: true // 可选：添加遮罩层防止误操作
    });
    console.log('接收到的参数:', options);
    const _id = options._id
    this.setData({
      active_id: _id
    },()=>{
      wx.hideLoading()
    })
    console.log(this.data.selected_type)
    // 刚进来的时候显示
    // 获取活动信息
    this.active_info();
  },
  onReady() {
  }
})